ひとりNavigation API Advent Calendar 11日目

https://gyazo.com/f26d83a36ac64d39808f84c0c7157f54

table:イベントハンドラ

Event handler Event handler event type

onnavigate navigate

onnavigatesuccess navigatesuccess

onnavigateerror navigateerror

oncurrententrychange currententrychange

code:onvagigate.js

onnavigate = (event) => { }

addEventListener("navigate", (event) => { })

code:onnavigatesuccess.js

onnavigatesuccess = (event) => { }

addEventListener("navigatesuccess", (event) => { })

code:onnavigateerror.js

onnavigateerror = (event) => { }

addEventListener("navigateerror", (event) => { })

code:oncurrententrychange.js

oncurrententrychange = (event) => { }

addEventListener("currententrychange", (event) => { })

NavigationTransition

navigation.transition.navigationType

navigation.transition.from

navigation.transition.to

現在のナビゲーション先のURLを反映させる時に使う

navigation.transition.committed

navigation.transition.finished

NavigationActivaition

navigation.activation.entry

navigation.activation.from

navigation.activation.navigationType

NavigationEvent

event.navigationType

event.destination

NavigationDestination

event.canIntercept

使える場合

使えない場合

別のページに移動するため、ページ内の一部分だけを変更するという方法では対応できないため

event.userInitiated

event.hashChange

event.signal

例えば、ユーザーがブラウザの「停止」ボタンを押した場合や、別のナビゲーションによって中断された場合など

event.formData

event.downloadRequest

event.info

ナビゲーションがユーザーによって開始された場合、または別のAPIによって開始された場合はundefined

event.hasUAVisualTransition

event.sourceElement

ナビゲーションの原因となった要素を返す

a 要素または area 要素、送信ボタン、あるいは送信されたフォーム要素のいずれかになる

event.scroll()